<template>
  <div class="device_list_box">
    <div class="header_title">
      设备运行列表汇总
    </div>
    <div style="height: 2rem"></div>
    <div class="table_header" style="height: 1rem">
      <div class="item_header border_height" style="border: none;height: 1rem">

      </div>
      <div class="item_header border_height" >

      </div>
      <div class="item_header border_height" >

      </div>
      <div class="item_header border_height" :style="{width:'60%'}" >
        <!--        <div style="width: 100%">-->
        <!--设备状态-->
        <device_time_item />
        <!--设备状态-->

        <!--        </div>-->
      </div>
      <div class="item_header border_height" >
        <!--设备状态-->

        <!--设备状态-->
      </div>
    </div>
    <div class="table_header">
      <div class="item_header">
        设备编号
      </div>
      <div class="item_header">
        设备名称
      </div>
      <div class="item_header">
        操作者
      </div>
      <div class="item_header" :style="{width:'60%'}">
<!--        <div style="width: 100%">-->
          <!--设备状态-->
          <status_device/>
          <!--设备状态-->

<!--        </div>-->
      </div>
      <div class="item_header">
        <!--设备状态-->
        状态
        <!--设备状态-->
      </div>
    </div>
    <device_run_list/>
  </div>
</template>

<script>
// import device_slicing from "@/views/cockpit/device_slicing";
import status_device from "@/components/device/status_device";
import device_run_list from "@/components/device/device_run_list";
import device_time_item from "@/components/device/device_time_item";

export default {
  name: "run_list",
  components: {
    status_device,
    device_run_list,
    device_time_item
  }
}
</script>

<style scoped lang="scss">
.device_list_box {
  background: url("http://www.newhlty.tz-group.com/img/bg.82f8f7db.png") no-repeat top center;
  height: 100%;
  background-size: 100% 100%;
  color: white;
  padding: 1rem;

  .header_title {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2rem;
  }
}

.table_header {
  display: flex;
  flex-direction: row;
  width: 100%;
  font-size: 1.0rem;
  color: white;

  .item_header {
    border: 0.001rem #16d1ff dashed;
    width: 10%;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .border_height{
    height: 1rem;
    border: none;
  }
}
</style>
